<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/normalize.css">
    <link rel="stylesheet" href="./static/font/iconfont.css">
    <link rel="stylesheet" href="./static/font1/iconfont.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/album.css">
    <title>QQ音乐</title>
</head>

<body>
    <!-- 头部 -->
    <header class="header w100">
        <div class="header-box w1600">
            <div class="header-nav">
                <div class="logo">
                    <a href="" class="logo-a">
                        <img src="images/logo.png" alt="" class="logo-pic">
                    </a>
                </div>
                <nav class="mainnav">
                    <ul class="mainnav-ul">
                        <li class="mainnav-li active">
                            <a href="" class="mainnav-a">音乐馆</a>
                        </li>
                        <li class="mainnav-li">
                            <a href="" class="mainnav-a">我的音乐</a>
                        </li>
                        <li class="mainnav-li mainnav-pop">
                            <a href="" class="mainnav-a">客户端
                                <img src="images/mark_1.png" alt="" class="mainnav-img">

                            </a>
                            <div class="pop-box">
                                <div class="pop-up">
                                    <ul class="pop-up-list">
                                        <li class="pop-up-items">
                                            <i class="pop-bg pop-up1"></i>
                                            <span class="pop-text">HQ高品质 全员开启</span>
                                        </li>
                                        <li class="pop-up-items">
                                            <i class="pop-bg pop-up2"></i>
                                            <span class="pop-text">独家音效 全面升级</span>
                                        </li>
                                        <li class="pop-up-items">
                                            <i class="pop-bg pop-up3"></i>
                                            <span class="pop-text">轻盈视觉 动态皮肤</span>
                                        </li>
                                        <li class="pop-up-items">
                                            <a href="" class="pop-update">下载体验</a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </li>
                        <li class="mainnav-li">
                            <a href="" class="mainnav-a">开放平台</a>
                        </li>
                        <li class="mainnav-li">
                            <a href="" class="mainnav-a">VIP</a>
                        </li>
                    </ul>
                </nav>
                <!-- 搜索框 -->
                <div class="search">
                    <form action="">
                        <button class="btn-search"></button>
                        <input type="text" class="inp-search" name="keywords" id="keywords" autocomplete="off"
                            placeholder="搜索音乐、MV、歌单、用户">
                        <div class="search-box">
                            <div class="search-menu">
                                <ul class="search-list">
                                    <li class="search-items">
                                        <a href="" class="search-links">
                                            <span class="num">1</span>
                                            <p class="search-info">我们的歌</p>
                                            <span class="count">76.5</span>
                                        </a>
                                    </li>
                                    <li class="search-items">
                                        <a href="" class="search-links">
                                            <span class="num">2</span>
                                            <p class="search-info">红尘客栈</p>
                                            <span class="count">176.5</span>
                                        </a>
                                    </li>
                                    <li class="search-items">
                                        <a href="" class="search-links">
                                            <span class="num">3</span>
                                            <p class="search-info">水星记</p>
                                            <span class="count">100.9</span>
                                        </a>
                                    </li>
                                    <li class="search-items">
                                        <a href="" class="search-links">
                                            <span class="num">4</span>
                                            <p class="search-info">林俊杰</p>
                                            <span class="count">44.5</span>
                                        </a>
                                    </li>
                                    <li class="search-items">
                                        <a href="" class="search-links">
                                            <span class="num">5</span>
                                            <p class="search-info">错位时空</p>
                                            <span class="count">106.5</span>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </form>
                </div>
                <!-- 用户功能 -->
                <div class="user-functions">
                    <a href="" class="login">登录</a>
                    <div class="user-menu menu-vip menu-list">
                        <span class="menu-content">开通VIP</span>
                        <div class="drop-menu">
                            <a href="" class="drop-menu-links">开通绿钻豪华版</a>
                            <a href="" class="drop-menu-links">开通付费包</a>
                        </div>
                    </div>
                    <div class="user-menu menu-money menu-list">
                        <span class="menu-content">充值</span>
                        <div class="drop-menu">
                            <a href="" class="drop-menu-links">购买乐币</a>
                            <a href="" class="drop-menu-links">充值饭票</a>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 子导航 -->
            <div class="subnav">
                <ul class="subnav-list">
                    <li class="subnav-items">
                        <a href="QQ.html" class="subnav-links">首页</a>
                    </li>
                    <li class="subnav-items">
                        <a href="singer.html" class="subnav-links">歌手</a>
                    </li>
                    <li class="subnav-items">
                        <a href="Newdisc.html" class="subnav-links">新碟</a>
                    </li>
                    <li class="subnav-items ">
                        <a href="top.html" class="subnav-links">排行榜</a>
                    </li>
                    <li class="subnav-items">
                        <a href="classify.html" class="subnav-links">分类歌单</a>
                    </li>
                    <li class="subnav-items">
                        <a href="MV.html" class="subnav-links">MV</a>
                    </li>
                    <li class="subnav-items">
                        <a href="radio.html" class="subnav-links">电台</a>
                    </li>
                    <li class="subnav-items active">
                        <a href="Album.html" class="subnav-links">数字专辑</a>
                    </li>
                    <li class="subnav-items">
                        <a href="ticket.html" class="subnav-links">票务</a>
                    </li>
                </ul>
            </div>
        </div>
    </header>
    <!-- 内容模块 -->
    <!-- 横幅 -->
    <section class="section w100">
        <div class="section-box w1600">
            <!-- banner 图 -->
            <div class="ticket-banner-box">
                <ul class="ticket-banner-ul">
                    <li class="ticket-banner-li">
                        <a href="" class="ticket-banner-a">
                            <img src="images/album/banner/1webp.webp" alt="" class="ticket-banner-pic">
                        </a>
                    </li>
                    <li class="ticket-banner-li">
                        <a href="" class="ticket-banner-a">
                            <img src="images/album/banner/2webp.webp" alt="" class="ticket-banner-pic">
                        </a>
                    </li>
                    <li class="ticket-banner-li">
                        <a href="" class="ticket-banner-a">
                            <img src="images/album/banner/3webp.webp" alt="" class="ticket-banner-pic">
                        </a>
                    </li>
                </ul>
                <div class="section-pagebar">
                    <ul class="pagebar-ul">
                        <a href="" class="pagebar-links">
                            <li class="pagebar-li active"></li>
                        </a>
                        <a href="" class="pagebar-links">
                            <li class="pagebar-li"></li>
                        </a>
                        <a href="" class="pagebar-links">
                            <li class="pagebar-li"></li>
                        </a>
                        <a href="" class="pagebar-links">
                            <li class="pagebar-li"></li>
                        </a>
                        <a href="" class="pagebar-links">
                            <li class="pagebar-li"></li>
                        </a>
                        <a href="" class="pagebar-links">
                            <li class="pagebar-li"></li>
                        </a>
                    </ul>
                </div>
            </div>
        </div>
        <!-- 左右按钮 -->
        <div class="btn-page btn-prev">
            <a href="" class="btn-page-link">
                <i class="btn-iconfont iconfont-prev"></i>
            </a>
        </div>
        <div class="btn-page btn-next">
            <a href="" class="btn-page-link ">
                <i class="btn-iconfont iconfont-next"></i>
            </a>
        </div>
    </section>
    <!-- 最新上架 -->
    <section class="section w100 sectionbgwhite ">
        <div class="section-box w1600">
            <!-- 模块内容 -->
            <div class="section-album-content mb40">
                <h2 class="album-content-title mb20">最新上架</h2>
                <ul class="section-album-list">
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="./images/album/content/1.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="Proof">Proof</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">BTS (防弹少年团)</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 38</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/2.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="Beatbox - The 2nd Album Repackage">Beatbox
                                    - The 2nd Album Repackage</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">NCT DREAM (엔시티 드림)</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 38</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/3.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link"
                                    title="SEVENTEEN 4th Album [Face the Sun]">SEVENTEEN 4th Album [Face the Sun]</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">SEVENTEEN (세븐틴)</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 25</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/4.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="= (Tour Edition)">= (Tour Edition)</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">Ed Sheeran (艾德·希兰)</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 25</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/5.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="大军师司马懿之军师联盟 & 虎啸龙吟 电视剧原声带">大军师司马懿之军师联盟 &
                                    虎啸龙吟 电视剧原声带</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">S.E.N.S. Project (神思者工作室)</a>
                            </p>
                            <p class="album-price"><i class="album-price-i">¥ 20</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                </ul>
            </div>
    </section>
    <!-- 本周热销 -->
    <section class="section w100 sectionbgwhite ">
        <div class="section-box w1600">
            <!-- 模块内容 -->
            <div class="section-album-content mb40">
                <h2 class="album-content-title mb20">本周热销</h2>
                <ul class="section-album-list">
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/6.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="和自己对话 From M.E. To Myself">和自己对话 From M.E. To Myself</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">林俊杰</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 18</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/7.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="UGLY BEAUTY">UGLY BEAUTY</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">蔡依林</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 20</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/8.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link"
                                    title="交换余生">交换余生</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">林俊杰</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 3</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/9.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="裹着心的光">裹着心的光</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">林俊杰</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 3</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/10.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="黑夜问白天">黑夜问白天</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">林俊杰</a>
                            </p>
                            <p class="album-price"><i class="album-price-i">¥ 2</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                </ul>
            </div>
    </section>
    <!-- 新声力量集结 -->
    <section class="section w100 sectionbgwhite ">
        <div class="section-box w1600">
            <!-- 模块内容 -->
            <div class="section-album-content mb40">
                <h2 class="album-content-title mb20">新声力量集结</h2>
                <ul class="section-album-list">
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/11.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="镜中兽（Mirror Me）">镜中兽（Mirror Me）</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">姚柏南</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 12</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/12.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="深深">深深</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">李振宁</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 6</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/13.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link"
                                    title="天气：晴">天气：晴</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">Sunnee杨芸晴</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 20</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/14.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="硬糖定律">硬糖定律
                                    </a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">硬糖少女303</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 10</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/15.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="虚实X境">虚实X境</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">THE9</a>
                            </p>
                            <p class="album-price"><i class="album-price-i">¥ 18</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                </ul>
            </div>
    </section>
    <!-- 内地专辑推荐 -->
    <section class="section w100 sectionbgwhite ">
        <div class="section-box w1600">
            <!-- 模块内容 -->
            <div class="section-album-content mb40">
                <h2 class="album-content-title mb20">内地专辑推荐</h2>
                <ul class="section-album-list">
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/16.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="π-volume.4">π-volume.4</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">鹿晗</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 7</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/17.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="不朽的•THE ART">不朽的•THE ART</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">阿云嘎</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 20</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/18.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link"
                                    title="光点">光点</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">肖战</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 3</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/19.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="牵挂">牵挂</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">张云雷</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 6</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/20.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="VICTORIA">VICTORIA</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">宋茜</a>
                            </p>
                            <p class="album-price"><i class="album-price-i">¥ 20</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                </ul>
            </div>
    </section>
    <!-- 韩国专辑推荐 -->
    <section class="section w100 sectionbgwhite ">
        <div class="section-box w1600">
            <!-- 模块内容 -->
            <div class="section-album-content mb40">
                <h2 class="album-content-title mb20">韩国专辑推荐</h2>
                <ul class="section-album-list">
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/21.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="How You Like That">How You Like That</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">BLACKPINK</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 3</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/22.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="Delight - The 2nd Mini Album">Delight - The 2nd Mini Album</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">伯贤 (백현)</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 20</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/23.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link"
                                    title="Monster - The 1st Mini Album">Monster - The 1st Mini Album</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">Red Velvet - IRENE & SEULGI</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 18</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/24.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="SEVENTEEN Special Album '; [Semicolon]">SEVENTEEN Special Album '; [Semicolon]</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">SEVENTEEN (세븐틴)</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 18</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/25.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="Super One - The 1st Album">Super One - The 1st Album</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">SuperM</a>
                            </p>
                            <p class="album-price"><i class="album-price-i">¥ 28</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                </ul>
            </div>
    </section>
    <!-- 影视剧OTS推荐 -->
    <section class="section w100 sectionbgwhite ">
        <div class="section-box w1600">
            <!-- 模块内容 -->
            <div class="section-album-content mb40">
                <h2 class="album-content-title mb20">影视剧OTS推荐</h2>
                <ul class="section-album-list">
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/26.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="有翡 电视剧原声带">有翡 电视剧原声带</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">华语群星</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 18</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/27.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="The King:永遠的君主 (The King : Eternal ">The King:永遠的君主 (The King : Eternal </a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">韩国群星 (Korea Various Artists)</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 25</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/28.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link"
                                    title="如意芳霏 影视原声专辑">如意芳霏 影视原声专辑</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">鞠婧祎 /许佳琪 /孔肖吟</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 10</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/29.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="安家 电视剧原声专辑">安家 电视剧原声专辑</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">华语群星</a></p>
                            <p class="album-price"><i class="album-price-i">¥ 15</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                    <li class="section-album-items">
                        <div class="sec-con-box">
                            <a href="" class="section-content-links">
                                <img src="images/album/content/30.webp" alt="" class="sec-con-pic">
                            </a>
                        </div>
                        <div class="sec-con-text">
                            <h3 class="sec-con-title">
                                <a href="#" class="sec-con-title-link" title="熹微">熹微</a>
                            </h3>
                            <p class="start-con-info"><a href="" class="start-con-author">王一博</a>
                            </p>
                            <p class="album-price"><i class="album-price-i">¥ 3</i> <span
                                    class="album-price-span">立即购买</span></p>
                        </div>
                    </li>
                </ul>
            </div>
    </section>
    <!-- footer -->
    <footer class="footer w100">
        <div class="footer-wrapper w1600">
            <div class="footer-box">
                <!-- 下载客户端 -->
                <div class="footer-update">
                    <h5 class="footer-title">下载QQ音乐客户端</h5>
                    <ul class="update-list">
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg1"></i>
                                PC版
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg2"></i>
                                Mac版
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg3"></i>
                                Android版
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg4"></i>
                                iPhone版
                            </a>
                        </li>
                    </ul>
                </div>
                <!-- 特色产品 -->
                <div class="footer-product">
                    <h5 class="footer-title">特色产品</h5>
                    <ul class="update-list ">
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg5"></i>
                                全民K歌
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg6"></i>
                                银河音效
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg7"></i>
                                QPlay
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg8"></i>
                                Fan直播伴侣
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                车载互联
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                QQ演出
                            </a>
                        </li>
                    </ul>
                </div>
                <!-- 合作链接 -->
                <div class="footer-coolink">
                    <h5 class="footer-title">合作链接</h5>
                    <div class="footer-coolink-box">
                        <a href="" class="footer-box-links">CJ ENM</a>
                        <a href="" class="footer-box-links">腾讯视频</a>
                        <a href="" class="footer-box-links">手机QQ空间</a>
                        <a href="" class="footer-box-links">最新版QQ</a>
                        <a href="" class="footer-box-links">腾讯社交广告</a>
                        <a href="" class="footer-box-links">电脑管家</a>
                        <a href="" class="footer-box-links">QQ浏览器</a>
                        <a href="" class="footer-box-links">腾讯微云</a>
                        <a href="" class="footer-box-links">腾讯云</a>
                        <a href="" class="footer-box-links">企鹅FM</a>
                        <a href="" class="footer-box-links">智能电视网</a>
                        <a href="" class="footer-box-links">当贝市场</a>
                        <a href="" class="footer-box-links">酷我音乐</a>
                        <a href="" class="footer-box-links">酷狗听书</a>
                    </div>
                </div>
                <!-- 开放平台 -->
                <div class="footer-coolink">
                    <h5 class="footer-title">开放平台</h5>
                    <div class="footer-coolink-box">
                        <a href="" class="footer-box-links">QQ音乐开放平台</a>
                        <a href="" class="footer-box-links">腾讯音乐人</a>
                        <a href="" class="footer-box-links">音乐推</a>
                    </div>
                </div>
                <!-- TME集团官网 -->
                <div class="footer-coolink">
                    <h5 class="footer-title">TME集团官网</h5>
                    <div class="footer-coolink-box">
                        <a href="" class="footer-box-links">腾讯音乐</a>
                    </div>
                </div>
            </div>
            <div class="footer-coopyright">
                <div class="coopyright-item">
                    <a href="" class="footer-box-links">关于腾讯 |</a>
                    <a href="" class="footer-box-links">About Tencent |</a>
                    <a href="" class="footer-box-links">服务条款 |</a>
                    <a href="" class="footer-box-links">用户服务协议 |</a>
                    <a href="" class="footer-box-links">隐私政策 |</a>
                    <a href="" class="footer-box-links">权利声明 |</a>
                    <a href="" class="footer-box-links">广告服务 |</a>
                    <a href="" class="footer-box-links">腾讯招聘 |</a>
                    <a href="" class="footer-box-links">客服中心 |</a>
                    <a href="" class="footer-box-links">网站导航</a>
                </div>
                <div class="coopyright-item">
                    Copyright © 1998 - 2022 Tencent.
                    <a href="" class="footer-box-links">All Rights Reserved.</a>
                </div>
                <div class="coopyright-item">
                    腾讯公司
                    <a href="" class="footer-box-links"> 版权所有 |</a>
                    <a href="" class="footer-box-links">营业执照 |</a>
                    网络文化经营许可证：
                    <a href="" class="footer-box-links">粤网文[2020]3396-195号 |</a>
                    客服电话:
                    <a href="" class="footer-box-links">4006016666</a>
                </div>
            </div>
        </div>
    </footer>
    <!-- 侧边栏 -->
    <aside class="side">
        <a href="" class="side-links">
            <i class="side-bg"></i>
        </a>
        <a href="" class="side-links">反馈</a>
        <a href="" class="side-links">
            <i class="side-bg music"></i>
        </a>
    </aside>
</body>

</html>